<template>
  <div>
    <el-form-item v-for="(item,index) in form_column" :key="index" :label="item.title" :prop="item.prop">
      <el-input v-if="item.type==='input'" v-model="queryParams[item.prop]" :placeholder="item.placeholder" clearable size="mini" :style="{width:item.width}" @keyup.enter.native="handleQuery" />
      <el-select v-else-if="item.type==='select'" v-model="queryParams[item.prop]" :placeholder="item.placeholder" clearable size="mini" :style="{width:item.width}">
        <el-option v-for="dict in item.options" :key="dict.value" :label="dict.label" :value="dict.value" />
      </el-select>
      <el-date-picker v-else-if="item.type==='date'" value-format="yyyy-MM-dd" v-model="queryParams[item.prop]" :type="item.type" :disabled="item.disabled" clearable :placeholder="item.label"></el-date-picker>
    </el-form-item>
    <el-form-item v-if="type !=='dialog'">
      <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
      <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
    </el-form-item>
  </div>
</template>

<script>
export default {
  name: "formItem",
  props: ['form_column', 'queryParams', 'type'],
  data() {
    return {}
  },
  methods: {
    handleQuery() {
      this.$emit('handleQuery', true)
    },
    resetQuery() {
      this.$emit('resetQuery', true)
    }
  }

}
</script>

<style>
</style>